﻿@using Critex.Helpers
@using System.Data.Entity
@using Critex.Models
@{
    Layout = null;
}
@Html.UseRootSection("Test gallery page")

<!DOCTYPE html>

<html>
<head>
    <meta name="viewport" content="width=device-width" />
    <title>Gallery page</title>
    <link rel="stylesheet" href="/Content/Nivo/themes/default/default.css" type="text/css" media="screen" />
    <link rel="stylesheet" href="/Content/Nivo/nivo-slider.css" type="text/css" media="screen" />
    <link rel="stylesheet" href="/Content/Nivo/style.css" type="text/css" media="screen" />
</head>
<body>
    @Html.UseSection("Gallery")

    <div id="wrapper">
        <a href="http://dev7studios.com" id="dev7link" title="Go to dev7studios">dev7studios</a>

        @Html.WriteHtmlAreaValue("Gallery description")

        <div class="slider-wrapper theme-default">
            <div id="slider" class="nivoSlider">
                @foreach (ImageArea imageArea in Html.GetImageCollectionAreaContents("Gallery content"))
                {
                    <img src="@imageArea.Location" data-thumb="@imageArea.Location" alt="@imageArea.ShortDescription" title="@imageArea.LongDescription" />
                }
            </div>
        </div>

    </div>
    <script type="text/javascript" src="/Content/Nivo/scripts/jquery-1.7.1.min.js"></script>
    <script type="text/javascript" src="/Content/Nivo/jquery.nivo.slider.js"></script>
    <script type="text/javascript">
        $(window).load(function () {
            $('#slider').nivoSlider();
        });
    </script>
</body>
</html>
